#include <ESP8266WiFi.h>
#include <OneWire.h>
#include <DallasTemperature.h>

#define DS18B20_PIN 2    // connected to GPIO2 (ESP8266 mini --> D4)

const char *ssid = "YXS1302";
const char *password = "YuanXueShe1302";

float tempC;

OneWire oneWire(DS18B20_PIN);
DallasTemperature sensors(&oneWire);

WiFiServer server(80);

void timerCallback();

void setup()
{
    sensors.begin();
    Serial.begin(115200);

    /* Connect to the WiFi network. */
    Serial.println("");
    Serial.print("Connecting to ");
    Serial.println(ssid);
    WiFi.begin(ssid, password);

    while (WiFi.status() != WL_CONNECTED) {
        delay(500);
        Serial.print(".");
    }

    Serial.println("");
    Serial.println("WiFi connected.");

    /* Start the Server. */
    server.begin();
    Serial.println("Server started");

    /* Output of the IP address. */
    Serial.print("Use this URL to connect: ");
    Serial.print("http://");
    Serial.print(WiFi.localIP());
    Serial.println("/");
}

void loop()
{
    /* Check whether a user has established a connection. */
    WiFiClient client = server.available();
    if (client) {
        /* Wait until the user sends data. */
        Serial.println("new client.");
        while (client.connected() && !client.available())
            delay(1);

        /* Reading the first line of the request. */
        String request = client.readStringUntil('\r');
        Serial.println(request);
        client.flush();

        client.println("HTTP/1.1 200 OK");
        client.println("Content-Type: text/html");
        client.println("");
        client.println("<!DOCTYPE HTML>");
        client.println("<html>");
        client.println("<meta name='viewport' content='width=device-width, initial-scale=1'>");
        client.println("<meta http-equiv='refresh' content='2'>");
        client.println("<head><title>ESP-01S Real-Time Temperature</title></head>");
        client.println("<style>");
        client.println("* {text-align: center; font-family: Conso-las;}");
        client.println(".container {position: absolute; top: 45%;");
        client.println("left: 50%; transform: translateX(-50%) translateY(-50%);}");
        client.println(".inner {font-size: 50px; color: #000333;}");
        client.println(".celsius {color: #007BFF;}");
        client.println(".fahrenheit {color: #FFC107;}");
        client.println(".separator {color: #111111;}");
        client.println("</style>");
        client.println("<div class='container'>");
        client.println("<div class='inner'>");

        /* Send the command to get temperatures */
        sensors.requestTemperatures();
        tempC = sensors.getTempCByIndex(0);

        client.println("<p>Temperature</p>");
        client.print("<p class='celsius'>");
        client.print(tempC);
        client.print((char)176);    //shows degrees character
        client.print("C ");
        client.print("<span class='separator'>|</span> ");
        client.print("<span class='fahrenheit'>");
        client.print(tempC * 1.8 + 32.0);
        client.print((char)176);    //shows degrees character
        client.println("F</p>");
        client.println("<style>");
        client.println(".footer-text { font-size: 30px; }");
        client.println(".bold-text { font-weight: bold; }"); 
        client.println("</style>");
        client.println("<div class='footer'>");
        client.println("<p class='footer-text'>This software was written by <span class='bold-text'>Grayson Zheng</span>.</p>");
        client.println("</div>");
        client.println("</div>");
        client.println("</html>");
        client.println("");
    }
}